<template>
	<view class="message">
		<view class="header">
			<text>消息</text>
		</view>
		<view class="message_inform">
			<u-notice-bar :text="notice"></u-notice-bar>
		</view>
		<view class="message_continer">
			<view style="width: 90%;height: 100rpx;margin: 25rpx 15rpx; display: flex;padding: 25rpx;" @tap="GoChat" v-for="(item,index) in visitUser"
				:key="index">
				<view style="width: 17%; height: 100%;">
					<image style="width: 100rpx;height: 100rpx;border-radius: 50%;" :src="item.imgSrc"></image>
				</view>
				<view style="width: 83%;height: 100%;line-height: 55rpx;">
					<view style="width: 100%;display: flex;">
						<view style="width: 60%; font-size: 35rpx; font-weight: bold;">{{ item.userName }}</view>
						<view style="width: 40%; text-align: right;font-size: 25rpx;color: #6c7f9b;">{{ item.topData }}</view>
					</view>
					<view>
						<u--text size="13" color="#b9b9b9" :lines="1" :text="item.topMessage"></u--text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				notice: '安心住提醒：谨防网络诈骗，线下看房注意安全',
				visitUser: [{
						imgSrc: "https://gd-hbimg.huaban.com/48e9409e988da8fff0bb0d06a8156362452ae1b41fb33-RM7g3s_fw236",
						userName: '小姐姐',
						topMessage: '周六时间不方便，我们约周日去看吧',
						topData: '下午 14:26'
					},
					{
						imgSrc: "https://www.keaitupian.cn/cjpic/frombd/1/253/4129174544/4172363501.jpg",
						userName: '小妹妹',
						topMessage: 'OK，那到时候再说',
						topData: '昨天 10:00'
					}
				],
			};
		},
		methods:{
			GoChat(){
				uni.navigateTo({
					url: './userChat'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.message {
		.header {
			width: 100%;
			height: 100rpx;
			margin: 50rpx 0 10rpx 0;
			text-align: center;
			line-height: 100rpx;
			font-weight: bold;
			font-size: 40rpx;
		}
	}
</style>